<!DOCTYPE html>
<html lang="en">

<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<meta name="viewport"
		content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<meta name="format-detection" content="telephone=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/index.css">
	<title>用户登录</title>
	<script type="text/javascript" src="js/flexible.js"></script>
</head>

<body>
	<div class="content mlogin" id="app">
		<!--  -->
		<div class="login-main">
			<div class="login-login">
				<img class="img100" src="./images/login/logo.png" alt="">
			</div>
			<div class="login-name">
				<img class="img100" src="./images/login/name.png" alt="">
			</div>
			<div class="login-title">
				<span>亿元补贴</span>
				<span>秒变大佬</span>
			</div>
			<div class="login-con">
				<div class="login-nav flex">
					<span class="login-nav-li flex1 flex-center-align" :class="curr==0?'on':''"
						@click="curr=0">手机号登录</span>
					<span class="login-nav-li flex1 flex-center-align" :class="curr==1?'on':''"
						@click="curr=1">密码登录</span>
				</div>
				<div v-if="curr==0" class="login-ts">未注册用户验证后自动注册并登录</div>
				<!-- 短信 -->
				<div class="login-icn" v-show="curr==0">
					<div class="login-inp flex-align">
						<input class="flex1" v-model="phone" placeholder-style="color:#C7C7C7" type="span"
							placeholder="请输入手机号" maxlength="11" />
					</div>
					<div class="login-inp flex-align">
						<input class="flex1" v-model="code" placeholder-style="color:#C7C7C7" type="span"
							placeholder="请输入验证码" maxlength="6" />
						<div class="yzmbox fz28">
							<span v-if="timeDown>=0"
								class="yzmbtn flex1 flex-center-align yzmno">{{timeDown}}秒后重试</span>
							<span v-else class="yzmbtn flex1 flex-center-align c13b" @click="getSms">获取验证码</span>
						</div>
					</div>
					<div class="login-ino flex-end mt20">
						<span>验证码没收到？</span>
						<span class="c13b ml10 open-kefu">人工客服获取</span>
						<span class="ml10">或</span>
						<span class="c13b ml10" @click="yyFun">语言验证码</span>
					</div>
				</div>
				<!-- 密码 -->
				<div class="login-icn" v-show="curr==1">
					<div class="login-inp flex-align">
						<input class="flex1" v-model="username" placeholder-style="color:#C7C7C7" type="text"
							placeholder="请输入手机号或账号" maxlength="30" autocomplete="off" />
					</div>
					<div class="login-inp flex-align">
						<input class="flex1" v-model="password" placeholder-style="color:#C7C7C7" type="password"
							placeholder="请输入密码" maxlength="30" autocomplete="off" />
					</div>
				</div>
				<!-- 短信 -->
				<div v-show="curr==0" class="login-btn flex-center-align mt40" @click="loginPhone">
					<span>登录</span>
				</div>
				<!-- 密码 -->
				<div v-show="curr==1" class="login-btn flex-center-align mt40" @click="loginName">
					<span>登录</span>
				</div>
				<div class="login-xy flex-center-align mt20" @click="flagRead=!flagRead">
					<span class="xya iconfont fz24" :class="flagRead?'iconchoice1':'iconchoice0'"></span>
					<span class="ml10">我已阅读并同意</span>
					<span class="xya" @click.stop="jumpAgree(1)">《用户协议》</span>
					<span>和</span>
					<span class="xya" @click.stop="jumpAgree(2)">《隐私政策》</span>
				</div>
				<div class="login-gg">
					<span @click="goIndex">先去逛逛</span>
				</div>
			</div>
			<!-- #ifdef APP-PLUS -->
			<div class="login-foot flex-center-align">

			</div>
			<!-- #endif -->
		</div>
		<!-- 客服 -->
		<m-chat ref="kf"></m-chat>
		<!--  -->
	</div>
	<!--  -->
	<script src="js/jquery.min.js"></script>
	<script src="js/vue-2.7.16.js"></script>
	<script src="js/used.js"></script>
	<script>
		new Vue({
			el: '#app',
			data() {
				return {
					curr: 0,
					phone: '', //手机号码
					code: '', //短信
					flagRead: false, //协议
					username: '', //用户名称
					password: '', //密码
					//短信
					time: 60,
					timeDown: -1,
				}
			},
			onLoad() {
				that = this;
			},
			methods: {
				//去首页
				goIndex() {
					goIndex();
				},

				//协议
				jumpAgree(type) {
					//《用户协议》
					if (type == 1) {
						window.location.href = 'https://apibox.sssgo.com/api/v1/Agreement/index?type=user'
					}
					//《隐私政策》
					if (type == 2) {
						window.location.href = 'https://apibox.sssgo.com/api/v1/Agreement/index?type=privacy'
					}
				},
				//语音验证码
				yyFun() {
					let phone = this.phone;
					//手机号
					if (!/^1[3456789]\d{9}$/.test(phone)) {
						toast.success("手机号有误")
						return
					}
					let params = {
						mobile: phone,
						type: 'vms',
						event: 'smsLogin'
					};
					this.$u.api.GetCodeNew(params).then(res => {
						toast.success(res.msg)
					})
				},
				//点击登录 - 短信登录
				loginPhone() {
					let phone = this.phone;
					let code = this.code;
					//手机号
					if (!/^1[3456789]\d{9}$/.test(phone)) {
						toast.success("手机号有误")
						return
					}
					//验证码
					if (code == '') {
						toast.success("请输入验证码")
						return
					}
					//协议
					if (this.flagRead == false) {
						toast.success("请先阅读并同意以下条款")
						return
					}
					//登录
					let params = {
						mobile: phone,
						captcha: code,
					};
					this.$u.api.mobileLogin(params).then(res => {
						console.log(res)
						toast.success(res.msg);
						if (res.code == 10000) {
							this.loginOk(res.data, 'PhoneLogin');
						}
					})
				},
				//点击登录 - 密码登录
				loginName() {
					let username = this.username;
					let password = this.password;
					if (username.length == 0) {
						toast.success("请输入手机号或账号")
						return
					}
					if (password == '') {
						toast.success("请输入密码")
						return
					}
					//协议
					if (this.flagRead == false) {
						toast.success("请先阅读并同意以下条款")
						return
					}

					let params = {
						username: username,
						password: password,
					};
					this.$u.api.AccountLogin(params).then(res => {
						toast.success(res.msg);
						if (res.code == 10000) {
							this.loginOk(res.data, 'password');
						}
					})
				},
				//登录完成
				loginOk(data, type) {
					this.$used.loginOkBack(data, type);
					// this.$store.commit('setUserObj', data)
					// uni.setStorageSync('xkey', data.token)
					// uni.setStorageSync('xobj', JSON.stringify(data))
					// // #ifdef APP-PLUS
					// this.$zml.onRegister(type); // 上报注册事件
					// // #endif
					// this.$zml.getUserinfo()
					// this.$zml.getMessageTalk(); // 获取消息发送至手机通知
					// let isregister = data.is_register == 0 ? 4 : 3; // 0登录 1注册
					// platformStatistics(isregister,data.id); // 平台统计
					// if (isregister == 3) trackJLData('active_register');
					// setTimeout(() => {
					// 	this.$used.loginOkGo('/pages/mine/mine', 3)
					// }, 1000)
				},
				/*短信*/
				//短信倒计时
				countDown() {
					let timeEnd = this.time;
					this.timeDown = this.time;
					let that = this;
					function getTime() {
						setTimeout(() => {
							if (that.timeDown >= 0) {
								that.timeDown--;
								getTime();
							}
						}, 1000)
					}
					getTime();
				},
				//重置倒计时
				ResetDown() {
					this.timeDown = -1;
				},
				//获取验证码
				async getSms() {
					var mobile = this.phone; //图形验证码
					//验证手机号码
					if (!/^1[3456789]\d{9}$/.test(mobile)) {
						toast.success('请输入正确的手机号码')
						return false;
					}
					let params = {
						mobile: this.phone,
						event: 'smsLogin'
					}
					//提交请求
					// let res = await this.$u.api.GetCodeNew(params)
					let res = {
						code: 10000,
						msg: '发送成功'
					}
					toast.success(res.msg)
					//图形验证码正确
					// res.data.code = '1'
					if (res.code == 10000) {
						this.countDown(); //执行倒计时
					}
				}

			}

		})
	</script>
</body>

</html>